<template>
	<view class="detail_wrap">
		<view class="top">
			<text class="title">{{title}}</text>
			<view class="date">{{date}}</view>
		</view>
		<view class="detail">
			<mp-html :content="html" style="font-size: 28rpx; color: #333333; line-height: 48rpx; font-weight: 400;"/>
		</view>
	</view>
</template>

<script>
	import {
		requestGet
	} from '@/utils/request.js'
	import mpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html'
	let notId;
	export default {
		data() {
			return {
				id: '',
				title: '', 
				date: '', 
				html: '小知不及大知，小年不及大年。奚以知其然也？朝菌不知晦朔，蟪蛄不知春秋，此小年也。楚之南有冥灵者，以五百岁为春，五百岁为秋；上古有大椿者，以八千岁为春，八千岁为秋，此大年也。而彭祖乃今以久特闻，众人匹之，不亦悲乎！'
			}
		},
		components: {mpHtml},
		onLoad: (options) => {
			notId = options.id
			console.log('notId', notId)
		},
		mounted() {
			this.getNoticeDet(notId)
		},
		methods: {
			getNoticeDet(id) {
				requestGet(`/home/content/detail/${id}`, null, '/baseplatform').then(res => {
					if (res.code === 200) {
						this.title = res.data.title
						this.date = res.data.createTime
						this.html = res.data && res.data.articleText ? res.data.articleText.split("\t").join("&nbsp;&nbsp;&nbsp;&nbsp;") : '';
					}
				}).catch((err) => console.log('错误了', err))
			}
		}
	}
</script>

<style lang="scss" scoped>
	.detail_wrap {
		.top {
			box-sizing: border-box;
			padding: 48rpx 40rpx;
		}
		.title {
			font-size: 32rpx;
			font-weight: 700;
			color: rgba(0,0,0,0.8);
			line-height: 44rpx;
		}
		.date {
			font-size: 24rpx;
			font-weight: 400;
			color: rgba(0,0,0,0.5);
			line-height: 34rpx;
			margin-top: 24rpx;
		}
		.detail {
			box-sizing: border-box;
			padding: 48rpx 40rpx 0;
			border-top: 2rpx solid rgba(0,0,0,0.1);
		}

		
	}
</style>